<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>关于我们</title>
    <link rel="stylesheet" href="/myplugs/css/my_lay_ui.css">
    <link rel="stylesheet" href="/myplugs/css/mycss.css">
    <link rel="stylesheet" href="/myplugs/css/portal.css">
    <link rel="stylesheet" href="/myplugs/css/about_us.css">
    <script src="http://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
</head>
<body>
<div class="app-content pt-3 p-md-3 p-lg-4" id="a">
    <div class="container-xl">
        <div class="row g-3 mb-4 align-items-center justify-content-between">
            <div class="col-auto about-us-box">
                <a class="app-page-title mb-0">关于我们(按姓名拼音排序)</a>
            </div>

            <div class="about-us-box-left">
                <div>
                    <div>
                        <div class="about-us-box-name">
                            <a class="app-page-title mb-1 zty our-name">组长：张田雨&emsp;</a>
                            <span class="app-page-title mb-0">Gitee-account:&emsp;
                                <a class="app-page-title mb-0 our-gitee" href="https://gitee.com/zhang--tianyu" target="_top">zhang--tianyu</a>
                            </span>
                        </div>
                    </div>
                    <div>
                        <div class="about-us-box-name">
                            <a class="app-page-title mb-1 gyf">&emsp;葛逸凡&emsp;</a>
                            <span class="app-page-title mb-0">Gitee-account:&emsp;
                                <a class="app-page-title mb-0 our-gitee" href="https://gitee.com/ge-yifan-1" target="_top">ge-yifan1</a>
                            </span>
                        </div>
                    </div>
                    <div>
                        <div>
                            <div class="about-us-box-name">
                                <a class="app-page-title mb-1 stt">&emsp;孙甜甜&emsp;</a>
                                <span class="app-page-title mb-0">Gitee-account:&emsp;
                                    <a class="app-page-title mb-0 our-gitee" href="https://gitee.com/sun-glass" target="_top">Sun-glas</a>
                                </span>
                            </div>
                        </div>
                    </div>
                    <div>
                        <div>
                            <div class="about-us-box-name">
                                <a class="app-page-title mb-1 wxy">&emsp;王宪莹&emsp;</a>
                                <span class="app-page-title mb-0">Gitee-account:&emsp;
                                    <a class="app-page-title mb-0 our-gitee" href="https://gitee.com/harriwww" target="_top">HarriWWW </a>
                                </span>
                            </div>
                        </div>
                    </div>
                    <div>
                        <div>
                            <div class="about-us-box-name">
                                <a class="app-page-title mb-1 yht">&emsp;颜慧婷&emsp;</a>
                                <span class="app-page-title mb-0">Gitee-account:&emsp;
                                    <a class="app-page-title mb-0 our-gitee" href="https://gitee.com/yan-huiting" target="_top"> Yan-huiting</a>
                                </span>
                            </div>
                        </div>
                    </div>
                    <div>
                        <div>
                            <div class="about-us-box-name">
                                <a class="app-page-title mb-1 yy">&emsp;姚遥&emsp;</a>
                                <span class="app-page-title mb-0">Gitee-account:&emsp;
                                    <a class="app-page-title mb-0 our-gitee" href="https://gitee.com/olinta" target="_top">Yao_Olinta</a>
                                </span>
                            </div>
                        </div>
                    </div>
                    <div>
                        <div>
                            <div class="about-us-box-name">
                                <a class="app-page-title mb-1 zyl">&emsp;周宇露&emsp;</a>
                                <span class="app-page-title mb-0">Gitee-account:&emsp;
                                    <a class="app-page-title mb-0 our-gitee" href="https://gitee.com/zhou-yulu" target="_top">zhou-yulu </a>
                                </span>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="about-us-box-inf">
                    <div class="about-us-title">Hello world!</div>
                    <div class="about-us-txt"><strong>·&emsp;</strong><span id="about-us-txt-1">欢迎来到这里</span></div>
                    <div class="about-us-txt"><strong>·&emsp;</strong><span id="about-us-txt-2">该页面是我们的人员构成</span></div>
                    <div class="about-us-txt"><strong>·&emsp;</strong><span id="about-us-txt-3">点击姓名显示人员分工</span></div>
                    <div class="about-us-txt append-1"><strong>·&emsp;</strong><span id="about-us-txt-4">点击账号跳转至Gitee账号</span></div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    //点击的标签变色，以显示当前查看的人员
    $(".about-us-box-name").find("a").click(
        function (e){
            $(".about-us-box-name a").removeClass("about-us-on");
            $(this).addClass("about-us-on");
        }
    )
    $(".zty").click(function () {
        $(".about-us-title").text("Main work");
        $("#about-us-txt-1").text("后台管理controller部分");
        $("#about-us-txt-2").text("后台管理弹窗部分");
        $("#about-us-txt-3").text("后台管理模糊搜索实现");
        $("#about-us-txt-4").text("重构部分：订单部分");
        清除重复元素，防止再次添加
        $(".append-1").nextAll().remove();
        //添加额外元素
        // $(".append-1").after("<div class=\"about-us-txt\"><strong>·&emsp;</strong><span class=\"about-us-txt-5\"></span></div>");
        // $(".append-1").after("<div class=\"about-us-txt\"><strong>·&emsp;</strong><span class=\"about-us-txt-5\"></span></div>")
    })
    $(".gyf").click(function () {
        $(".about-us-title").text("Main work");
        $("#about-us-txt-1").text("网页初步布局格式设计");
        $("#about-us-txt-2").text("图片转码功能初步实现");
        $("#about-us-txt-3").text("完善数据库编写");
        $("#about-us-txt-4").text("参与项目各部分后端编写");
        //清除重复元素，防止再次添加
        $(".append-1").nextAll().remove();
        //添加额外元素
        $(".append-1").after("<div class=\"about-us-txt\"><strong>·&emsp;</strong><span class=\"about-us-txt-5\">修改网页各类bug,吃鸭霸王</span></div>");
        $(".append-1").after("<div class=\"about-us-txt\"><strong>·&emsp;</strong><span class=\"about-us-txt-5\">MD5加密设置</span></div>")

    })
    $(".stt").click(function () {
        $(".about-us-title").text("Main work");
        $("#about-us-txt-1").text("管理员登录");
        $("#about-us-txt-2").text("手机验证码");
        $("#about-us-txt-3").text("部分数据库事务");
        $("#about-us-txt-4").text("重构部分：整体实体类");
        //清除重复元素，防止再次添加
        $(".append-1").nextAll().remove();
        $(".append-1").after("<div class=\"about-us-txt\"><strong>·&emsp;</strong><span class=\"about-us-txt-5\">整体service</span></div>");
        $(".append-1").after("<div class=\"about-us-txt\"><strong>·&emsp;</strong><span class=\"about-us-txt-5\">mybatis-plus操作数据库</span></div>");
    })
    $(".wxy").click(function () {
        $(".about-us-title").text("Main work");
        $("#about-us-txt-1").text("重构controller部分，以及jsp修改至html");
        $("#about-us-txt-2").text("后台管理item编辑信息部分");
        $("#about-us-txt-3").text("重构ajax改善体验部分完善");
        $(".append-1").nextAll().remove();

    })
    $(".yht").click(function () {
        $(".about-us-title").text("Main work");
        $("#about-us-txt-1").text("商品信息展示");
        $("#about-us-txt-2").text("商品信息修改和新增");
        $("#about-us-txt-3").text("查找商品");
        $("#about-us-txt-4").text("重构部分：商品展示模块");
        $(".append-1").nextAll().remove();

    })
    $(".yy").click(function () {
        $(".about-us-title").text("Main work");
        $("#about-us-txt-1").text("连接数据库并初步测试语句");
        $("#about-us-txt-2").text("编写部分实体类");
        $("#about-us-txt-3").text("协同建立项目整体框架");
        $("#about-us-txt-4").text("全局CSS样式设计及修改");
        //清除重复元素，防止再次添加
        $(".append-1").nextAll().remove();
        //添加额外元素
        $(".append-1").after("<div class=\"about-us-txt\"><strong>·&emsp;</strong><span class=\"about-us-txt-5\">编写第一个详细信息弹窗</span></div>");
        $(".append-1").after("<div class=\"about-us-txt\"><strong>·&emsp;</strong><span class=\"about-us-txt-5\">数据库事务处理和上锁功能</span></div>")

    })
    $(".zyl").click(function () {
        $(".about-us-title").text("Main work");
        $("#about-us-txt-1").text("数据库连接及sql语句");
        $("#about-us-txt-2").text("service层及其实现");
        $("#about-us-txt-3").text("RESTFUL API小组作业准备及pre");
        $(".append-1").nextAll().remove();
    })
</script>
</body>
</html>